<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // vm.a -> vm.data.a
        // vm.methd ->vm.props.method
        let vm = {
            data:{
                username:'feifei',
                age:20
            },
            props:{
                componentID:12,
                user:'js'
            }
        }
        function proxy(vm, prop, key){
            Object.defineProperty(vm, key,{
                get(){
                    console.log('访问'+key)
                    return vm[prop][key]
                },
                set(newVal){
                    vm[prop][key] = newVal
                    console.log('设置'+key)
                }
            })
        }
        for(let key in vm.data){
            proxy(vm, 'data', key)
        }
    </script>
</body>
</html>